<template>
    <div>
        <!-- <div class="toptitle">商品列表</div> -->
        <!-- <el-row id="order_total">
      <el-col :span="12">
        <div class="order_content" style="cursor:pointer;" @click="toggleUpLowerStatus('')">
          <div class="order_total_title">商品总数</div>
          <div class="order_total_info">
            <span class="order_data">{{ totalData.goodsNum }}</span>
            <span class="order_dw"></span>
          </div>
        </div>
      </el-col>
      <el-col :span="12">
        <div class="order_content" >
          <div class="order_total_title">商品分类数</div>
          <div class="order_total_info">
            <span class="order_data">{{ totalData.upLowerGoodsTypeNum }}</span>
            <span class="order_dw"></span>
          </div>
        </div>
      </el-col>
       <el-col :span="6">
        <div class="order_content" style="cursor:pointer;" v-bind:class="upLowerClass" @click="toggleUpLowerStatus(1)">
          <div class="order_total_title">强上架商品数</div>
          <div class="order_total_info">
            <span class="order_data">{{ totalData.upLowerGoodsNum }}</span>
            <span class="order_dw"></span>
          </div>
        </div>
      </el-col>
      <el-col :span="6">
        <div class="order_content" style="cursor:pointer;" v-bind:class="unUpLowerClass" @click="toggleUpLowerStatus(0)">
          <div class="order_total_title">非强上架商品数</div>
          <div class="order_total_info">
            <span class="order_data">{{ totalData.unUpLowerGoodsNum }}</span>
            <span class="order_dw"></span>
          </div>
        </div>
      </el-col>
        </el-row>-->
        <el-form :inline="true" :model="formInline" class="demo-form-inline" @keyup.enter.native="search()">
            <!-- <el-row :span="24">
                <el-col :span="6"> -->
                    <el-form-item label="商品名称">
                        <br> <br>
                        <el-input
                        style="margin-left:-80px;width:200px"
                            v-model="formInline.productName"
                      
                            @keyup.enter.native="search()"
                            clearable
                        ></el-input>
                    </el-form-item>
                <!-- </el-col>
                <el-col :span="6"> -->
                    <el-form-item label="商品分类" style="margin-left:15px">
                        <br> <br>
                        <el-select
                            v-model="formInline.goodsTypeId"
                            style="margin-left:-80px;width:200px"
                            clearable
                         
                            @change="getProductType(giftProEdit.goodsTypeId)"
                        >
                            <el-option
                                v-for="(send,i) in typeData"
                                :key="i"
                                :value="send.goodsTypeId"
                                :label="send.goodsTypeName"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                <!-- </el-col>

                <el-col :span="6"> -->
                    <!-- <el-form-item label="标签类型" style="margin-left:15px">
                        <br> <br>
                        <el-select
                            v-model="formInline.tagType"
                            style="margin-left:-80px;width:200px"
                            collapse-tags
                            clearable
                        
                        >
                            <el-option
                                v-for="(send,i) in tagTypeform.tagTypeCodes"
                                :key="i"
                                :value="send.id"
                                :label="send.label"
                            ></el-option>
                        </el-select>
                    </el-form-item> -->
                <!-- </el-col>
                <el-col :span="6"> -->
                    <el-form-item label="状态" prop="status" style="margin-left:40px">
                        <br> <br>
                        <el-select
                            v-model="formInline.status"
                          
                          style="margin-left:-80px;width:200px"
                        >
                            <el-option label="禁用" :value="0"></el-option>
                            <el-option label="启用" :value="1"></el-option>
                        </el-select>
                    </el-form-item>
                <!-- </el-col>
            </el-row>
            <el-row :span="24">
                <el-col :span="6"> -->
                    <el-form-item label="是否限购" style="margin-left:15px">
                        <br> <br>
                        <el-select v-model="formInline.isBuyLimit" clearable style="margin-left:-80px;width:200px">
                            <!-- <el-option label="全部" value></el-option> -->
                            <el-option label="是" value="1"></el-option>
                            <el-option label="否" value="0"></el-option>
                        </el-select>
                    </el-form-item>
                        <br />
                <!-- </el-col>
                    <br />
                <el-col :span="6"> -->
                    <el-form-item label="商品类型">
                        <br> <br>
                        <el-select v-model="formInline.goodsStyle" clearable style="margin-left:-80px;width:200px">
                            <el-option label="普通商品" value="1"></el-option>
                            <el-option label="宴席商品" value="2"></el-option>
                            <el-option label="生日活动专属" value="3"></el-option>
                            <el-option label="预售商品" value="4"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="计量单位" style="margin-left:15px">
                        <br> <br>
                        <el-input
                        style="margin-left:-80px;width:200px"
                            v-model="formInline.unit"
                            @keyup.enter.native="search()"
                            clearable
                        ></el-input>
                    </el-form-item>
                    <el-form-item label="商品编码" style="margin-left:15px">
                        <br> <br>
                        <el-input
                        style="margin-left:-80px;width:200px"
                            v-model="formInline.goodsSeq"
                            @keyup.enter.native="search()"
                            clearable
                        ></el-input>
                    </el-form-item>
                    <el-form-item label="商品限价" style="margin-left:15px">
                        <br> <br>
                        <el-input
                        style="margin-left:-80px;width:200px"
                            v-model="formInline.saleLowerPrice"
                            @keyup.enter.native="search()"
                            clearable
                        ></el-input>
                    </el-form-item>
                <!-- </el-col>
                <el-col :span="6"> -->
                    <el-form-item style="margin-left:950px;text-align:right;">
                        <el-button
                            type="primary"
                            @click="search()"
                            size="mini"
                            icon="el-icon-search"
                        >查询</el-button>
                        <el-button
                            type="primary"
                            @click="kong()"
                            size="mini"
                            icon="el-icon-delete"
                        >清空</el-button>
                        <el-button
                            type="primary"
                            @click="addNew()"
                            size="mini"
                            icon="el-icon-edit"
                        >新增</el-button>
                    </el-form-item>
                <!-- </el-col>
            </el-row> -->
        </el-form>
        <el-table
            :data="tableData"
            border
            v-loading="loading"
            style="font-size: 10px;height:500px"
            width="100%"
            height="400px"
            :header-cell-style="{background:'#ebecf0',color:'#606266'}"
        >
            <el-table-column
                type="index"
                label="序号"
                align="center"
                :index="indexMethod"
                width="60"
              
            ></el-table-column>
            <el-table-column
                prop="goodsSeq"
                label="商品编码"
                width="160"
                align="right"
                show-overflow-tooltip
            ></el-table-column>
            <el-table-column
                prop="goodsName"
                label="商品名称"
                width="160"
                align="left"
                show-overflow-tooltip
            ></el-table-column>
            <el-table-column
                prop="barCode"
                label="国际条码"
                width="160"
                align="left"
                show-overflow-tooltip
            ></el-table-column>
            <el-table-column
                prop="goodsTypeName"
                label="商品分类"
                width="160"
                align="left"
                show-overflow-tooltip
            ></el-table-column>
            <el-table-column prop="unitName" label="计量单位" align="left"></el-table-column>
            <el-table-column align="center" prop="picture" label="图片">
                <template slot-scope="scope">
                    <img
                        :src="scope.row.picture.picUrl"
                        v-if="scope.row.picture !='' && scope.row.picture !=null"
                        width="70" @click="$seeImage"
                        height="50"
                    />
                </template>
            </el-table-column>
            <el-table-column prop="isBuyLimit" label="是否限购" width="120" align="center">
                <template slot-scope="scope">{{scope.row.isBuyLimit===1?'是':'否'}}</template>
            </el-table-column>
            <el-table-column prop="goodsStyle" label="商品类型" width="120" align="center">
                <template slot-scope="scope">{{scope.row.goodsStyle===1?'普通商品':scope.row.goodsStyle===2?'宴席商品':scope.row.goodsStyle===3?'生日活动专属':"预售商品"}}</template>
            </el-table-column>

            <!-- <el-table-column prop="upLower" label="是否强上架" align="left">
        <template slot-scope="scope">{{scope.row.upLower===0?'否':'是'}}</template>
            </el-table-column>-->
            <el-table-column prop="salePrice" label="建议零售价" align="right" :formatter="fixData"></el-table-column>
            <el-table-column prop="memberPrice" label="会员价" align="right" :formatter="fixData"></el-table-column>
            <el-table-column prop="saleLowerPrice" label="商品限价" align="right" :formatter="fixData"></el-table-column>
            <el-table-column prop="consumerIntegral" label="消费者酒币" align="right" :formatter="fixData"></el-table-column>
            <el-table-column prop="merchantIntegral" label="商家云币" align="right" :formatter="fixData"></el-table-column>
            <el-table-column prop="createTime" label="创建时间" width="160" align="center"></el-table-column>
            <el-table-column prop="updateTime" label="修改时间" width="160" align="center"></el-table-column>
            <el-table-column prop="sortNo" label="展示序号" width="90" align="center"></el-table-column>
            <!-- <el-table-column prop label="标签类型" width="360" align="left">
                <template slot-scope="scope">
                    <el-checkbox-group
                        v-model="scope.row.tagTypes"
                        v-if="scope.row.tagType!=null && scope.row.tagType!=''"
                        size="mini"
                    >
                        <el-checkbox-button
                            v-for="item in tagTypeform.tagTypeCodes"
                            :key="item.id"
                            :label="item.id"
                        >{{item.label}}</el-checkbox-button>
                    </el-checkbox-group>
                    <span v-if="scope.row.tagType==null || scope.row.tagType==''">——————</span>
                </template>
            </el-table-column> -->
            <el-table-column prop="status" label="状态" align="center">
                <template slot-scope="scope">{{scope.row.status==0?'禁用':'启用'}}</template>
            </el-table-column>
            <el-table-column label="操作" align="center" fixed="right" width="150">
                <template slot-scope="scope">
                    <el-button
                        size="mini"
                        @click="showDetail(scope.row)"
                        type="text"
                        v-show="true"
                    >明细</el-button>

                    <el-button
                        size="mini"
                        @click="editNew(scope.row)"
                        type="text"
                        v-show="scope.row.status ==1"
                    >编辑</el-button>
                    <el-button
                        type="text"
                        @click="deleteClick(scope.row,0)"
                        size="mini"
                        v-if="scope.row.status ==1"
                    >禁用</el-button>
                    <el-button
                        type="text"
                        @click="deleteClick(scope.row,1)"
                        size="mini"
                        v-if="scope.row.status ==0"
                    >启用</el-button>
                    <!-- <el-link
                        type="danger"
                        @click="deleteClick(scope.row,0)"
                        size="small"
                        v-if="scope.row.status ==1"
                    >禁用</el-link>
                    <el-link
                        type="success"
                        @click="deleteClick(scope.row,1)"
                        size="small"
                        v-if="scope.row.status ==0"
                    >启用</el-link>-->
                </template>
            </el-table-column>
        </el-table>

        <el-dialog title="商品管理" :visible.sync="dialogVisible" width="40%">
            <el-form :rules="rules" ref="giftProEdit" :model="giftProEdit" label-width="80px">
                <el-form-item label="商品名称" prop="goodsName" class="label_edit">
                    <el-input v-model="giftProEdit.goodsName" class="input_edit"></el-input>
                </el-form-item>
                <el-form-item label="商品条码" prop="goodsBarcode" class="label_edit">
                    <el-input v-model="giftProEdit.goodsBarcode" class="input_edit"></el-input>
                </el-form-item>
                <el-form-item label="助记码" prop="mnemonicCode" class="label_edit">
                    <el-input v-model="giftProEdit.mnemonicCode" class="input_edit"></el-input>
                </el-form-item>
                <el-form-item label="图片" prop="mnemonicCode" class="label_edit">
                    <el-upload
                        class="upload-demo"
                        action="http://mt.wssaa.com/api/file-service/v1/file/uploadFile"
                        :on-preview="handlePreview"
                        :on-remove="handleRemove"
                        :file-list="fileList2"
                        :on-success="upLoadPic"
                        :headers="headers"
                        list-type="picture"
                    >
                        <el-button size="small" type="primary">点击上传</el-button>
                        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                    </el-upload>
                </el-form-item>

                <el-form-item label="商品分类" class="label_edit">
                    <el-select
                        v-model="giftProEdit.goodsTypeId"
                        class="input_edit"
                        @change="getProductType(giftProEdit.goodsTypeId)"
                    >
                        <el-option
                            v-for="(send,i) in typeData"
                            :key="i"
                            :value="send.goodsTypeId"
                            :label="send.goodsTypeName"
                        ></el-option>
                    </el-select>
                </el-form-item>

                <el-form-item label="商品品牌" class="label_edit">
                    <el-select
                        v-model="giftProEdit.brandReq"
                        class="input_edit"
                        @change="getProductBrands(giftProEdit.brandReq)"
                    >
                        <el-option
                            v-for="(send,i) in brandData"
                            :key="i"
                            :value="send.brandReq"
                            :label="send.brandName"
                        ></el-option>
                    </el-select>
                </el-form-item>

                <el-form-item label="商品单位" class="label_edit">
                    <el-select
                        v-model="giftProEdit.unit"
                        class="input_edit"
                        @change="getProductUnit(giftProEdit.unit)"
                    >
                        <el-option
                            v-for="(send,i) in unitData"
                            :key="i"
                            :value="send.unitCode"
                            :label="send.unitName"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="是否启用" prop class="label_edit">
                    <el-radio v-model="giftProEdit.status" label="1">启用</el-radio>
                    <el-radio v-model="giftProEdit.status" label="0">禁用</el-radio>
                </el-form-item>
                <el-form-item label="进价" prop="buyPrice" class="label_edit">
                    <el-input
                        v-model.number="giftProEdit.buyPrice"
                        type="number"
                        min="0"
                        class="input_edit"
                        placeholder="进价"
                        style="width:60%"
                    >
                        <template slot="append">元</template>
                    </el-input>
                </el-form-item>
                <el-form-item label="售价" prop="salePrice" class="label_edit">
                    <el-input
                        v-model.number="giftProEdit.salePrice"
                        type="number"
                        min="0"
                        class="input_edit"
                        placeholder="售价"
                        style="width:60%"
                    >
                        <template slot="append">元</template>
                    </el-input>
                </el-form-item>

                <el-form-item label="详情" prop class="label_edit">
                    <el-input
                        type="textarea"
                        :rows="3"
                        placeholder="请输入内容"
                        v-model="giftProEdit.remark"
                    ></el-input>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false" size="mini">取 消</el-button>
                <el-button type="primary" @click="confirmEdit('giftProEdit')" size="mini">确 定</el-button>
            </span>
        </el-dialog>

        <el-dialog :visible.sync="dialogVisibleImg" size="tiny">
            <img width="100%" :src="dialogImageUrl" alt />
        </el-dialog>

        <div class="block" style="margin-top:2px">
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :page-sizes="[10, 20, 30, 50, 100, 150, 200]"
                :current-page="listQuery.current"
                :page-size="listQuery.size"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total"
            ></el-pagination>
        </div>
    </div>
</template>

<script>
import {
  getProductTotalInfo,
  getProductList,
  queryGoodsCategorys,
  getProductUnitList,
  getSupplyList,
  queryGoodsBrands,
  createGoodsInfo,
  modifyGoodsInfo,
  deleteGoodsInfo,
  cutGoodsInfo
} from "@/api/product";
import { queryGoodsTypeList } from "@/api/tagmanage";
import qs from "qs";
export default {
  data() {
    return {
      listQuery: {
        current: 1,
        size: 100
      },
      totalData: {
        goodsNum: 0,
        upLowerGoodsNum: 0,
        upLowerGoodsTypeNum: 0,
        unUpLowerGoodsNum: 0
      },
      tableData: [
        // {
        //   goodsName: "五粮液白酒",
        //   goodsBarcode: "2221",
        //   unitName: "箱",
        //   typeName: "酒",
        //   brandName: "五粮液",
        //   pictures: "111",
        //   mnemonicCode: "99999",
        //   status: "1",
        //   isComb: "1"
        // }
      ],
      headers: {
        token: localStorage.getItem("token") //从cookie里获取token，并赋值  Authorization ，而不是token
      },
      loading: true,
      giftProEdit: {
        goodsName: "",
        goodsBarcode: "",
        goodsId: "",
        mnemonicCode: "",
        goodsTypeId: "",
        unit: "",
        buyPrice: 0,
        status: "",
        salePrice: 0,
        remark: ""
      },

      dialogVisible: false,
      dialogVisibleImg: false,
      dialogImageUrl: "",
      formInline: {
        goodsName: "",
        goodsTypeId: "",
        tagType: "",
        status: 1,
        upLower: "",
        isBuyLimit: "",
        goodsStyle: ""
      },
      total: 0,
      typeData: [],
      brandData: [],
      unitData: [],
      supplyData: [],
      tagTypeform: {
        tagTypeCodes: []
      },
      fileList2: [],
      rules: {
        goodsName: [{ required: true, message: "请输入名称", trigger: "blur" }]
      }
    };
  },
  mounted() {
    this.queryGoodsTypeList();
    this.getProductTotalInfo();
    this.getProductList();
    this.getProductType();
    // this.getProductBrands();
  },
  methods: {
    kong() {
      this.formInline.productName = "";
      this.formInline.goodsTypeId = "";
      this.formInline.tagType = "";
      this.formInline.status = 1;
      this.formInline.isBuyLimit = "";
      this.formInline.goodsStyle = "";
    },
    //搜索查询
    search() {
      this.loading = true;
      let data = {
        size: this.listQuery.size,
        current: 1,
        condition: {
          goodsName: this.formInline.productName,
          goodsTypeId: this.formInline.goodsTypeId,
          tagType: this.formInline.tagType,
          status: this.formInline.status,
          upLower: this.formInline.upLower,
          isBuyLimit: this.formInline.isBuyLimit,
          goodsStyle: this.formInline.goodsStyle
        },
        ascs: [],
        descs: []
      };
      getProductList(data).then(res => {
        this.loading = false;
        this.tableData = res.records;
        this.tableData.forEach((item,i) => {
         item.tagTypes = item.tagType && item.tagType.length > 0 ?  item.tagType.split(",") : [];
    });
        this.total = res.total;
      });
    },
    //查询合计数据
    getProductTotalInfo() {
      let data = {orgSeq: this.orgSeq};
      getProductTotalInfo(data).then(res => {
        this.totalData = {
          goodsNum: res.result.total,
          upLowerGoodsNum: res.result.upNum,
          upLowerGoodsTypeNum: res.result.typeNum == null ? 0 : res.result.typeNum,
          unUpLowerGoodsNum: res.result.noUpNum
        };
      });
    },
    //初始化查询
    getProductList() {
      let data = {
        size: this.listQuery.size,
        current: this.listQuery.current,
        condition: {
          goodsName: this.formInline.productName,
          goodsTypeId: this.formInline.goodsTypeId,
          status: this.formInline.status,
          tagType: this.formInline.tagType,
          upLower: this.formInline.upLower,
          isBuyLimit: this.formInline.isBuyLimit,
          goodsStyle: this.formInline.goodsStyle
        },
        ascs: [],
        descs: []
      };
      getProductList(data).then(res => {
        this.loading = false;
        this.tableData = res.records;
        this.tableData.forEach((item,i) => {
          item.tagTypes = item.tagType && item.tagType.length > 0 ?  item.tagType.split(",") : [];
    });
        this.total = res.total;
        this.getProductTotalInfo();
      });
    },
    //启用  禁用
    handleClick(v) {
      if (v.status === 0) {
        var flag = 1;
      } else if (v.status === 1) {
        var flag = 0;
      }
      let data = { goodsId: v.goodsId, status: flag };
      enableGiftPro(qs.stringify(data)).then(res => {
        this.getProductList();
        this.$message({
          showClose: true,
          message: res.message,
          type: "success"
        });
      });
    },
    //删除
    deleteClick(v,t) {
        v.createTime = "";
        v.updateTime = "";
        // console.log(qs.stringify(v));
      let data = {
        goodsId: v.goodsId,
        priceId: v.priceId,
        status: t
        };
        let manage = t==1?"启用":"禁用";
      this.$confirm("确认"+manage + v.goodsName + " 吗？").then(_ => {
          cutGoodsInfo(data).then(res => {
            this.$message({
              showClose: true,
              message: res.message,
              type: res.code == 1 ? "success" : "error"
            });
            this.getProductList();
            this.getProductTotalInfo();
          });
        }).catch(_ => {});
    },

    //编辑
    edit(v) {
      this.fileList2 = [];
      this.getProductType();
      this.getProductUnit();
      this.getProductBrands();
      let price = v.price;
      if (price != null) {
        this.giftProEdit.buyPrice = price.buyPrice;
        this.giftProEdit.salePrice = price.salePrice;
      }

      let pictures = v.pictures;
      // if (pictures.length > 0) {
      //   pictures.forEach((item, i) => {
      //     var picUrl = item.picUrl;
      //     var aa = picUrl.substring(index - 5, picUrl.length);
      //     var name = item.name;
      //     let data = {
      //       name: aa,
      //       url: picUrl
      //     };
      //     this.fileList2.push(data);
      //   });
      // }
      this.giftProEdit.goodsId = v.goodsId;
      this.giftProEdit.goodsName = v.goodsName;
      this.giftProEdit.goodsBarcode = v.goodsBarcode;
      this.giftProEdit.brandReq = v.brandReq;
      this.giftProEdit.mnemonicCode = v.mnemonicCode;
      this.giftProEdit.goodsTypeId = v.goodsTypeId;
      this.giftProEdit.unit = v.unit;

      this.giftProEdit.status = String(v.status);
      this.giftProEdit.remark = v.remark;
      this.dialogVisible = !this.dialogVisible;
      this.editflag = false;
    },
    //新增
    add() {
      //数据置空
      this.fileList2 = [];
      this.giftProEdit.goodsName = "";
      this.giftProEdit.goodsBarcode = "";
      this.giftProEdit.brandReq = "";
      this.giftProEdit.mnemonicCode = "";
      this.giftProEdit.goodsTypeId = "";
      this.giftProEdit.unit = "";
      (this.giftProEdit.buyPrice = 1),
        (this.giftProEdit.salePrice = 1),
        (this.giftProEdit.status = "1");
      this.giftProEdit.remark = "";
      this.dialogVisible = !this.dialogVisible;
      this.editflag = true;
      this.getProductType();
      this.getProductUnit();
      this.getProductBrands();
    },

    //查询商品分类
    getProductType(v) {
      let data = {};
      queryGoodsCategorys(data).then(res => {
        this.typeData = res.records.filter(item => item.goodsTypeName != '自营商品');
      });
    },

    //查询商品单位
    getProductUnit(v) {
      let data = {};
      getProductUnitList(data).then(res => {
        this.unitData = res.records;
      });
    },

    //查询商品品牌
    getProductBrands(v) {
      let data = {
        size: 100,
        current: 1,
        condition: {
          status: "1"
        },
        ascs: [],
        descs: []
      };
      queryGoodsBrands(data).then(res => {
        this.brandData = res.records;
      });
    },

    //查询商品供应商
    getSupply(v) {
      let data = {};
      getSupplyList(data).then(res => {
        this.supplyData = res.records;
      });
    },
    //删除图片
    handleRemove(file, fileList) {
      console.log(file, fileList);
      let newfileList = [];
      fileList.forEach((item, i) => {
        let data = {
          name: item.name,
          url: item.url
        };
        newfileList.push(data);
      });
      this.fileList2 = newfileList;
    },
    //预览图片
    handlePreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisibleImg = true;
    },

    upLoadPic(file, fileList) {
      var picUrl = file.result;
      var name = fileList.name;
      let data = {
        name: name,
        url: picUrl
      };
      this.fileList2.push(data);
    },

    confirmEdit(formName) {
      console.log(this.fileList2);
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.submitForm();
        } else {
          alert("请输入必填项!");
          return false;
        }
      });
    },

    addNew() {
      this.$router.push({
        name: "productEdit",
        params: {
            total:this.total
        }
      });
    },

    editNew(v) {
      this.$router.push({
        name: "productEdit",
        params: {
          edit: v,
          total:this.total
        }
      });
    },

    submitForm() {
      let price = {
        buyPrice: this.giftProEdit.buyPrice,
        salePrice: this.giftProEdit.salePrice
      };
      let pictures = [];
      this.fileList2.forEach((item, i) => {
        let data = {
          picUrl: item.url
        };
        pictures.push(data);
      });

      if (this.editflag) {
        //新增
        let data = {
          goodsId: "",
          goodsName: this.giftProEdit.goodsName,
          goodsBarcode: this.giftProEdit.goodsBarcode,
          brandReq: this.giftProEdit.brandReq,
          mnemonicCode: this.giftProEdit.mnemonicCode,
          goodsTypeId: this.giftProEdit.goodsTypeId,
          status: this.giftProEdit.status,
          unit: this.giftProEdit.unit,
          price: price,
          pictures: pictures
        };
        createGoodsInfo(data).then(res => {
          this.dialogVisible = !this.dialogVisible;
          this.$message({
            showClose: true,
            message: "添加成功",
            type: "success"
          });
          this.getProductList();
        });
      } else {
        //编辑
        let data = {
          goodsId: this.giftProEdit.goodsId,
          goodsName: this.giftProEdit.goodsName,
          goodsBarcode: this.giftProEdit.goodsBarcode,
          brandReq: this.giftProEdit.brandReq,
          mnemonicCode: this.giftProEdit.mnemonicCode,
          goodsTypeId: this.giftProEdit.goodsTypeId,
          status: this.giftProEdit.status,
          unit: this.giftProEdit.unit,
          price: price,
          pictures: pictures
        };
        modifyGoodsInfo(qs.stringify(data)).then(res => {
          this.dialogVisible = !this.dialogVisible;
          this.$message({
            showClose: true,
            message: "修改成功",
            type: "success"
          });
          this.getProductList();
        });
      }
    },
    //明细
  showDetail(v) {
      this.$router.push({
        name: "productDetail",
        params: {
          edit: v
        }
      });
    },
    handleSizeChange(val) {
      this.listQuery.size = val;
      this.getProductList();
    },
    handleCurrentChange(val) {
      this.listQuery.current = val;
      this.getProductList();
    },
    indexMethod(index) {
      let curpage = this.listQuery.current; //单前页码，具体看组件取值
      let limitpage = this.listQuery.size; //每页条数，具体是组件取值
      return index + 1 + (curpage - 1) * limitpage;
    },
    renderContent(h, { node, data, store }) {
      return (
        `<span style="flex: 1; display: flex; align-items: center; justify-content: space-between; font-size: 14px; padding-right: 8px;">
          <span>
            <span>{node.label}</span>
          </span>
        </span>`
      );
    },
    //头部点击切换上下架状态
    toggleUpLowerStatus(status) {
      if (this.formInline.upLower === status) {
        this.formInline.upLower = "";
      } else {
        this.formInline.upLower = String(status);
      }
      this.search();
    },
    fixData(row, column, cellValue, index) {
      if (cellValue != null && !isNaN(cellValue)) {
        return cellValue.toFixed(2);
      } else {
        return cellValue;
      }
    },
    queryGoodsTypeList() {
      let data = {
        size: 99,
        current: 1,
        condition: {}
      };
      queryGoodsTypeList(data).then(res => {
        this.tagTypeform.tagTypeCodes = [];
        res.records.forEach((item, i) => {
          let data = {
            id: item.uuid,
            label: item.tagName
          };
          this.tagTypeform.tagTypeCodes.push(data);
          // this.tagTypeform.tagTypeCodes.push(item.tagName);
        });
      });
    }
  },


  //其他
  computed: {
    LowerClass: function() {
      return {
        base: true,
        "bg-sel": this.formInline.upLower == ''
      };
    },
    upLowerClass: function() {
      return {
        base: true,
        "bg-sel": this.formInline.upLower == "1"
      };
    },
    unUpLowerClass: function() {
      return {
        base: true,
        "bg-sel": this.formInline.upLower == "0"
      };
    }
  }
};
</script>
<style lang="less" scoped>
.toptitle {
    border: 1px solid #e0e0e0;
    border-bottom: 2px solid #188097;
    background: #f5f5f5;
    line-height: 35px;
    margin-bottom: 10px;
    padding: 0 10px;
    font-size: 14px;
    font-weight: bold;
}
.scoreSty {
    width: 160px;
}

.label_edit {
    margin-left: 50px;
}

.el-row {
    margin-bottom: 20px;
    &:last-child {
        margin-bottom: 0;
    }
}
.el-col {
    border-radius: 4px;
}
.order_content {
    width: 250px;
    padding: 20px 0;
    margin: 0 auto;
    text-align: center;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
}
.order_content .order_total_title {
    color: #000;
}
.order_content .order_total_info {
    margin: 10px 0;
}
.order_content .order_data {
    font-size: 1.4em;
    font-weight: bold;
}
.order_content .compared_title {
    font-size: 0.8em;
    color: #999;
}
.bg-sel {
    background: #fafad2;
}
.demo-form-inline .el-form-item {
    margin-bottom: 0px;
}
.el-row {
    margin-bottom: 0px;
}
/**style="color:#00af57"style="color:#FF0000" */
</style>
